<template>
	<view>
		<Navbar></Navbar>
		
		
		<Exhibition :data="conventionData" :statusData="exhibitionData" @onViewVideo="onViewVideo" @openSwiper="openSwiper"></Exhibition>

		<view style="height: 300rpx;"></view>

		<Bottom :isTwice="isSupplier ? false : true" :isThird="isSupplier ? true : false"
			:rightText="isSupplier ? '修改信息' :'联系'" :centerText="'联系'" @confirm="onCallSupplier" @center="onCallSupplier"
			@right="onEditConvention"></Bottom>

		<!-- 开屏视频 -->
		<VideoPlay :show="videoData.show" :url="videoData.url" @close="videoData.show = false">
			<template v-if="videoData.type == 1">
				<view class="learn-btn">关闭视频</view>
			</template>
			<template v-else>
				<u-icon size="50" class="u-p-r-8" color="#fff" name="close-circle" />
			</template>
		</VideoPlay>
		
		<!-- 提示框 -->
		<Modal :show="modal.show" :confirmText="modal.confirm" :cancelText="modal.cancel" :modalContent="modal.content"
			:showCancel="modal.showCancel" :showConfirm="modal.showConfirm" @confirm="modalConfirm"
			@cancel="modal.show = false"></Modal>
		
		<!-- 开通引导 -->
		<NoticePopup :show="isNoticeShow" :type="2" @onCloseNotice="isNoticeShow = false"></NoticePopup>	
	</view>
</template>

<script>
	import Navbar from '@/components/Navbar.vue'
	import Bottom from '@/components/Bottom.vue'
	import VideoPlay from '@/components/VideoPlay.vue'
	import Exhibition from '@/components/Exhibition.vue'
	import NoticePopup from '@/components/NoticePopup.vue'
	import Modal from '@/components/Modal.vue'
	import {
		getFindSupplyDetail
	} from '@/network/demand.js'
	import {
		userExhibitionStatus,
		userExhibitionRecord
	} from '@/network/api.js'
	import share from '@/mixins/share.js'
	import {
		formatContent,
		call
	} from '@/utils/index.js'
	export default {
		mixins: [share],
		components: {
			Navbar,
			Bottom,
			VideoPlay,
			Modal,
			Exhibition,
			NoticePopup
		},
		data() {
			return {
				conventionData: {},
				supplier_id: '',
				inviterId: '',
				style: {
					video: 'width: 100% !important'
				},
				modal: {
					show: false,
					showCancel: true,
					showConfirm: true,
					confirm: '确定',
					cancel: '取消',
					content: ''
				},
				videoData: {
					show: false,
					type: 1, // 1开屏 2介绍
					url: ''
				},
				isSupplier: false, // 是否展厅创建者
				isNoticeShow: false, // 是否展厅高级展厅提示
				exhibitionData: {} // 创建者高级展厅信息
			}
		},
		onLoad(options) {
			this.supplier_id = options.id
			this.onGetDetail(options.id)
			if(options.inviterId){
				this.inviterId = options.inviterId
			}
			this.onRecord(1)
		},
		methods: {
			async onRecord(val){
				const params = {
					type: val,
					company_id: this.supplier_id,
					user_id: uni.getStorageSync("user_id"),
					reference_id: this.inviterId
				}
				userExhibitionRecord(params)
			},
			async onGetDetail(val) {
				const res = await getFindSupplyDetail({
					supplier_id: val
				})
				res.data.swiperList = []
				res.data.attach.map(item => {
					const params = {
						image: item
					}
					res.data.swiperList.push(params)
				})
				res.data.business = formatContent(res.data.business)
				res.data.detail = formatContent(res.data.detail)
				res.data.detail = res.data.detail.replace(
					/(<\s*video[^>]*)style[=\s\"\']+[^\"\']*[\"\']?([^>]*>)/gi, "$1$2")
				if (res.data.contracts.some(item => item.user_id == ('' + uni.getStorageSync("user_id")))) {
					this.$nextTick(() => {
						this.isSupplier = true
					})
				} else {
					this.onGetUserExhibition()
				}
				this.conventionData = res.data
				this.mixinsShare.page =
					`/pages/conventionDetail/conventionDetail?id=${this.supplier_id}&inviterId=${uni.getStorageSync("user_id")}`
				this.mixinsShare.title = `在线展厅：${res.data.company_name}`
				this.mixinsShare.image = res.data.logo

				const exRes = await userExhibitionStatus({
					userid: res.data.contracts[0].user_id
				})
				this.exhibitionData = exRes.data
				if (exRes.data.video && exRes.data.video.url) {
					this.videoData.type = 1
					this.videoData.url = exRes.data.video.url
					this.videoData.show = true
				}
			},
			async onGetUserExhibition() {
				const res = await userExhibitionStatus({
					userid: uni.getStorageSync("user_id")
				})
				if (!this.isSupplier && [0, 2].includes(res.data.is_have)) {
					this.isNoticeShow = true
				}
			},
			openSwiper(val) {
				let list = []
				val.list.map(item=>list.push(item.image))
				uni.previewImage({
					current: val.index,
					urls: list
				})
			},
			onCallSupplier() {
				this.onRecord(2)
				call(this.conventionData.contracts[0].phone)
			},
			onEditConvention() {
				userExhibitionStatus({
					userid: uni.getStorageSync("user_id")
				}).then(res => {
					switch (Number(res.data.status)) {
						case -1:
							this.modal.content = "您的申请未通过"
							this.modal.confirm = "重新申请"
							this.modal.show = true
							break;
						case 0:
						case 2:
							this.modal.content = "您已提交资料，系统审核中，请耐心等候"
							this.modal.confirm = "确定"
							this.modal.show = true
							break;
						case 1:
							if(res.data.is_have == 1){
								uni.navigateTo({
									url: "/operate/seniorForm/seniorForm?type=2"
								})
							}else{
								uni.navigateTo({
									url: "/operate/seniorForm/seniorForm?type=1"
								})
							}
							break;
					}
				})
			},
			onViewVideo(val) {
				this.videoData.type = 2
				this.videoData.url = val.url
				this.videoData.show = true
			},
			modalConfirm() {
				userExhibitionStatus({userid: this.user_id}).then(res=>{
					if(res.data.status == -1 && [1].includes(res.data.is_have)){
						uni.navigateTo({
							url: "/operate/seniorForm/seniorForm?type=2"
						})
					}
					if(res.data.status == -1 && [0,2].includes(res.data.is_have)){
						uni.navigateTo({
							url: "/operate/exhibition/exhibition"
						})
					}
					if(res.data.status == 1 && [1].includes(res.data.is_have)){
						uni.navigateTo({
							url: "/operate/seniorForm/seniorForm?type=2"
						})
					}
					if(res.data.status == 1 && [0,2].includes(res.data.is_have)){
						uni.navigateTo({
							url: "/operate/seniorForm/seniorForm?type=1"
						})
					}
				})
				this.modal.show = false
			},
		}
	}
</script>

<style scoped>
	.learn-btn {
		background: #FB630E;
		color: #fff;
		padding: 18rpx 120rpx;
		border-radius: 50rpx;
		font-size: 26rpx;
	}
</style>